Vue.js 3.x 高效前端開發 (視頻教學版)

Vue.js 3.x 高效前端開發 (視頻教學版)

作者: 李小威
出版社: 清華大學
出版在: 2022-03-01
ISBN-13: 9787302601296
ISBN-10: 7302601291





內容描述


本書通過對Vue.js示例和綜合案例的介紹與演練,使讀者快速掌握Vue.js 3.x框架的用法,提高Web前端的實戰開發能力。本書配套示例源碼、PPT課件、教學教案、同步教學視頻、習題及答案、其他資源與答疑服務。 本書共分17章,內容包括Vue.js 3.x基本概念、創建Vue.js實例、Vue.js的插值語法、精通指令、計算屬性、v-bind及class與style綁定、表單與v-model雙向綁定、精通監聽器、事件處理、過渡和動畫效果、組件和組合API、虛擬DOM和render()函數、精通Vue CLI和Vite、使用Vue Router開發單頁面應用、使用axios與服務器通信、使用Vuex管理組件狀態以及網上商城項目案例。 本書內容豐富、註重實踐,對Vue.js框架的初學者而言,是一本簡明易懂的入門書和工具書;對從事Web前端開發的讀者來說,也是一本難得的參考手冊。本書也適合作為高等院校和培訓機構電腦相關專業的教材。


目錄大綱


目    錄
第1章  認識Vue.js 3.x 1
1.1  Web前端技術的發展歷程 1
1.1.1  從靜態向動態轉變 1
1.1.2  從後端走向前端 2
1.1.3  從前端走向全端 2
1.2  Vue.js概述 2
1.2.1  Vue.js是什麽 2
1.2.2  Vue.js發展歷程 4
1.3  MV*模式 4
1.3.1  MVC模式 4
1.3.2  MVVM模式 5
第2章  創建Vue.js實例 6
2.1  安裝vue-devtools 6
2.2  在項目中引入Vue.js 8
2.2.1  使用CDN 9
2.2.2  使用NPM 9
2.2.3  使用命令行工具CLI 9
2.2.4  使用Vite 10
2.3  安裝和使用編輯器HBuilder 10
2.4  項目實訓—我的第一個Vue.js程序 12
第3章  Vue.js模板語法 16
3.1  創建應用程序實例 16
3.2  插值 17
3.3  方法選項 19
3.3.1  使用方法 19
3.3.2  傳遞參數 21
3.3.3  方法之間的調用 22
3.4  Vue實例的生命周期 23
3.4.1  認識生命周期鉤子函數 23
3.4.2  created和mouted 25
3.5  指令 27
第4章  精通指令 29
4.1  常見內置指令 29
4.1.1  v-show指令 29
4.1.2  v-bind指令 30
4.1.3  v-model 31
4.1.4  v-on 33
4.1.5  v-text 34
4.1.6  v-html 35
4.1.7  v-once 36
4.1.8  v-pre 37
4.1.9  v-cloak 38
4.2  條件渲染指令 39
4.2.1  v-if 39
4.2.2  v-else-if和v-else 40
4.2.3  v-for 41
4.3  指令縮寫 53
4.4  自定義指令 53
4.4.1  註冊自定義指令 53
4.4.2  鉤子函數 54
4.4.3  動態指令參數 56
4.5  項目實訓—通過指令實現隨機背景色效果 57
第5章  計算屬性 59
5.1  計算屬性的定義 59
5.2  計算屬性的getter和setter方法 60
5.3  計算屬性的緩存 62
5.4  計算屬性代替v-for和v-if 65
5.5  項目實訓—使用計算屬性設計計算器 66
第6章  v-bind及class與style綁定 68
6.1  綁定HTML樣式class 68
6.1.1  數組語法 68
6.1.2  對象語法 70
6.1.3  用在組件上 74
6.2  綁定內聯樣式style 74
6.2.1  對象語法 74
6.2.2  數組語法 77
6.3  項目實訓—設計隔行變色的水果信息表 78
第7章  表單與v-model雙向綁定 81
7.1  實現雙向數據綁定 81
7.2  單行文本輸入框 81
7.3  多行文本輸入框 82
7.4  復選框 83
7.5  單選按鈕 85
7.6  選擇框 86
7.7  值綁定 89
7.7.1  復選框 89
7.7.2  單選框 89
7.7.3  選擇框的選項 90
7.8  修飾符 91
7.8.1  lazy 91
7.8.2  number 92
7.8.3  trim 93
7.9  項目實訓—設計用戶註冊頁面 94
第8章  精通監聽器 96
8.1  使用監聽器 96
8.2  監聽方法和對象 97
8.2.1  監聽方法 97
8.2.2  監聽對象 98
8.3  實例方法$watch 101
8.4  項目實訓—使用監聽器設計購物車效果 102
第9章  事件處理 107
9.1  監聽事件 107
9.2  事件處理方法 108
9.3  事件修飾符 111
9.3.1  stop 112
9.3.2  capture 114
9.3.3  self 115
9.3.4  once 117
9.3.5  prevent 118
9.3.6  passive 119
9.4  按鍵修飾符 119
9.5  系統修飾鍵 121
9.6  項目實訓—處理用戶註冊信息 122
第10章  過渡和動畫效果 125
10.1  單元素/組件的過渡和動畫 125
10.1.1  CSS過渡 125
10.1.2  過渡的類名 127
10.1.3  CSS動畫 129
10.1.4  自定義過渡的類名 130
10.1.5  動畫的JavaScript鉤子函數 131
10.2  初始渲染的過渡 135
10.3  多個元素的過渡 136
10.4  列表過渡 137
10.4.1  列表的進入/離開過渡 138
10.4.2  列表的排序過渡 139
10.4.3  列表的交錯過渡 140
10.5  項目實訓—設計折疊菜單的過渡動畫 142
第11章  組件和組合API 145
11.1  組件是什麽 145
11.2  組件的註冊 146
11.2.1  全局註冊 146
11.2.2  局部註冊 147
11.3  使用prop向子組件傳遞數據 147
11.3.1  prop基本用法 148
11.3.2  單向數據流 151
11.3.3  prop驗證 151
11.3.4  非prop的屬性 153
11.4  子組件向父組件傳遞數據 154
11.4.1  監聽子組件事件 155
11.4.2  將原生事件綁定到組件 156
11.4.3  .sync修飾符 158
11.5  插槽 160
11.5.1  插槽基本用法 160
11.5.2  編譯作用域 160
11.5.3  默認內容 161
11.5.4  命名插槽 162
11.5.5  作用域插槽 165
11.5.6  解構插槽prop 166
11.6  什麽是組合API 168
11.7  setup()函數 168
11.8  響應式API 169
11.8.1  reactive()方法和watchEffect()方法 169
11.8.2  ref()方法 170
11.8.3  readonly()方法 171
11.8.4  computed()方法 172
11.8.5  watch()方法 172
11.9  項目實訓—使用組件創建樹狀項目分類 173
第12章  虛擬DOM和render()函數 176
12.1  虛擬DOM 176
12.2  render()函數 177
12.3  創建組件的VNode 180
12.4  使用JavaScript代替模板功能 181
12.4.1  v-if和v-for 181
12.4.2  v-on 182
12.4.3  事件和按鍵修飾符 182
12.4.4  插槽 183
12.5  函數式組件 185
12.6  JSX 185
12.7  項目實訓—設計商品採購信息列表 186
第13章  精通Vue CLI和Vite 189
13.1  腳手架的組件 189
13.2  腳手架環境搭建 190
13.3  安裝腳手架 191
13.4  創建項目 192
13.4.1  使用命令 192
13.4.2  使用圖形化界面 195
13.5  分析項目結構 196
13.6  配置scss、less和stuly 198
13.7  配置文件gackage.json 201
13.8  Vue.js 3.x新增的開發構建工具Vite 202
第14章  使用Vue Router開發單頁面應用 205
14.1  使用Vue Router 205
14.1.1  在HTML頁面使用路由 205
14.1.2  在項目中使用路由 210
14.2  命名路由 211
14.3  命名視圖 213
14.4  路由傳參 217
14.5  編程式導航 222
14.6  組件與Vue Router之間解耦 226
14.6.1  布爾模式 226
14.6.2  對象模式 229
14.6.3  函數模式 232
第15章  使用axios與服務器通信 235
15.1  什麽是axios 235
15.2  安裝axios 236
15.3  基本用法 236
15.3.1  get請求和post請求 236
15.3.2  請求JSON數據 238
15.3.3  跨域請求數據 239
15.3.4  並發請求 241
15.4  axios API 243
15.5  請求配置 244
15.6  創建實例 246
15.7  配置默認選項 246
15.8  攔截器 247
15.9  項目實訓—顯示近7日的天氣情況 248
第16章  使用Vuex管理組件狀態 250
16.1  什麽是Vuex 250
16.2  安裝Vuex 251
16.3  在項目中使用Vuex 252
16.3.1  搭建一個項目 252
16.3.2  state對象 254
16.3.3  getter對象 255
16.3.4  mutation對象 257
16.3.5  action對象 259
第17章  開發網上商城項目 262
17.1  系統功能模塊 262
17.2  系統結構分析 263
17.3  系統運行效果 263
17.4  系統功能模塊設計與實現 264
17.4.1  首頁頭部組件 264
17.4.2  首頁信息模塊 265
17.4.3  用戶註冊與登錄模塊 268
17.4.4  商品模塊 270
17.4.5  購買模塊 276
17.4.6  支付模塊 277
後記 279




相關書籍

The Modern Web: Multi-Device Web Development with HTML5, CSS3, and JavaScript (Paperback)

作者 Peter Gasston

2022-03-01

深入實戰 Vue 開發

作者 殷榮檜

2022-03-01

JavaScript 設計模式與開發實踐

作者 曾探

2022-03-01